<template>
  <div class="warpper">

    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
      <el-tab-pane label="Customer Detailed Collection Report (By Salesman)" name="first">
        <customerdetailedcollectionreport />
      </el-tab-pane>
      <el-tab-pane label="Statement of Accounts" name="second">
        <samplestatementofaccounts />
      </el-tab-pane>
      <el-tab-pane label="Creditor Aging Listing of all Suppllers" name="three">
        <supperstatementofaccounts />
      </el-tab-pane>
    </el-tabs>


  </div>
</template>

<script>
  import CURD from "@/mixin/CURD";
  import customerdetailedcollectionreport from "@/components/customerpayment/customerdetailedcollectionreport.vue"
  import supperstatementofaccounts from "@/components/customerpayment/supperstatementofaccounts.vue"
  import samplestatementofaccounts from "@/components/customerpayment/samplestatementofaccounts.vue"
  export default {
    name: "customerpaymentIndex",
    mixins: [CURD],
    components: {
      customerdetailedcollectionreport,
      supperstatementofaccounts,
      samplestatementofaccounts,
    },
    data() {
      return {
        activeName: 'first',
      };
    },
    async created() {

    },
    methods: {

    }
  }
</script>